<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">
	<h:head>
		<link type="text/css" rel="stylesheet"
			href="#{request.contextPath}/resources/css/default.css" />
	</h:head>
	<h:form id="refinedBy" prependId="false" >
		<p:panel toggleable="true" id="panelPrice"  header="Price Range" style="border:none;">

			<h:panelGrid columns="1">
				<h:outputText id="displayRange" style="width:120px;"
					value="INR #{itemsManagedBean.priceMinRange} -  INR #{itemsManagedBean.priceMaxRange}" />
				<p:slider for="txt6,txt7" style="width:120px;"
					minValue="#{itemsManagedBean.priceMinBoundary}"
					maxValue="#{itemsManagedBean.priceMaxBoundary}"
					displayTemplate="Between {min} and {max}" range="true"
					display="displayRange">
					<p:ajax event="slideEnd" listener="#{itemsManagedBean.onSlideEnd}"
						process="@this txt6 txt7" update="@form :itemList" />
				</p:slider>
				<h:inputHidden id="txt6" value="#{itemsManagedBean.priceMinRange}" />
				<h:inputHidden id="txt7" value="#{itemsManagedBean.priceMaxRange}" />
			</h:panelGrid>

			<p:separator />
			<p:selectCheckboxMenu label="Click to show" style="width:183px; margin-left:-10px;"
				styleClass="without-selectall"
				value="#{itemsManagedBean.selectedBrandList }" filter="true"
				filterMatchMode="contains" scrollHeight="100"
				panelStyleClass="start-expended">
				<p:ajax listener="#{itemsManagedBean.filteryByBrand}" event="change"
					process="@this" update="@form :itemList" />
				<f:selectItems value="#{itemsManagedBean.brandMap}" />
			</p:selectCheckboxMenu>
		</p:panel>
	</h:form>
</ui:composition>